<template>
  <div>
    <!--引用表格-->
   <BasicTable @register="registerTable" :rowSelection="rowSelection">
     <!--插槽:table标题-->
      <template #tableTitle>
          <j-upload-button  type="primary" preIcon="ant-design:import-outlined" @click="onImportXls">导入</j-upload-button>
          <a-button  type="primary" preIcon="ant-design:export-outlined" @click="onExportXls"> 导入模板</a-button>
      </template>
      <template #statusSlot="{ record }">
        <Tag v-if="record.status==0" color="green">正常</Tag>
        <Tag v-if="record.status==1" color="red">失效</Tag>
      </template>
      <template #rowItem1="{ record }">
        <div v-if="record.day1">
          <Tag  color="green" >{{ record.day1 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,1)">删</Tag>
          -->
        </div>
      </template>
      <template #rowItem2="{ record }">
        <div v-if="record.day2">
          <Tag color="blue">{{ record.day2 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,2)">删</Tag>
          -->
        </div>
      </template>
      <template #rowItem3="{ record }">
        <div v-if="record.day3">
          <Tag color="purple">{{ record.day3 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,3)">删</Tag>
          -->
        </div>
        
      </template>
      <template #rowItem4="{ record }">
        <div v-if="record.day4">
          <Tag color="cyan">{{ record.day4 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,4)">删</Tag>
          -->
        </div>
      </template>
      <template #rowItem5="{ record }">
        <div v-if="record.day5">
          <Tag color="magenta">{{ record.day5 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,5)">删</Tag>
          -->
        </div>
      </template>
      <template #rowItem6="{ record }">
        <div v-if="record.day6">
          <Tag color="pink">{{ record.day6 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,6)">删</Tag>
          -->
        </div>
      </template>
      <template #rowItem7="{ record }">
        <div v-if="record.day7">
          <Tag color="orange">{{ record.day7 }}</Tag>
          <!--
          <Tag color="red" style="cursor: pointer;margin-left:5px;" @click="onItemClick(record.id,record.semesterId,7)">删</Tag>
          -->
        </div>
      </template>
    </BasicTable>
    
  </div>
</template>

<script lang="ts" name="course-csEnrollments" setup>
  import { reactive} from 'vue';
  import {BasicTable} from '/@/components/Table';
  import { Tag} from 'ant-design-vue';
  import { useListPage } from '/@/hooks/system/useListPage'
  import {columns, searchFormSchema} from './CsEnrollments.data';
  import {list,deleteOne, getImportUrl,getownloadTemplate} from './CsEnrollments.api';
  const queryParam = reactive<any>({});
  //注册model
  //注册table数据
  const { tableContext,onExportXls,onImportXls } = useListPage({
      tableProps:{
           title: '学生订课信息',
           api: list,
           columns,
           canResize:false,
           showActionColumn:false,
           clickToRowSelect:true,
           formConfig: {
              //labelWidth: 120,
              schemas: searchFormSchema,
              autoSubmitOnEnter:true,
              fieldMapToNumber: [
              ],
              fieldMapToTime: [
                 ['createTime', ['createTime_begin', 'createTime_end'], 'YYYY-MM-DD'],
              ],
            },
           actionColumn: {
               width: 120,
               fixed:'right'
            },
            beforeFetch: (params) => {
              return Object.assign(params, queryParam);
            },
      },
       exportConfig: {
            name:"导入模板",
            url: getownloadTemplate,
            params: queryParam,
          },
          importConfig: {
            url: getImportUrl,
            success: handleSuccess
          },
  })

  const [registerTable, {reload},{selectedRowKeys }] = tableContext

   
   /**
    * 成功回调
    */
  function handleSuccess() {
      (selectedRowKeys.value = []) && reload();
   }

   async function onItemClick(code,semesterId,workDay) {
     await deleteOne({personId: code,workDay:workDay,semesterId:semesterId}, handleSuccess);
   }

</script>

<style scoped>

</style>